import 'dart:math';

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:getwidget/components/image/gf_image_overlay.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/route/route.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/styles.dart';
import 'package:meal/utils/tools.dart';

///
/// 自建活动
///
class MarketBuildActivity extends StatefulWidget {
  const MarketBuildActivity({Key? key}) : super(key: key);

  @override
  State<MarketBuildActivity> createState() => _MarketBuildActivityState();
}

class _MarketBuildActivityState extends State<MarketBuildActivity> {
  TextStyle get style {
    return StylesUtils.customTextStyle(fontSize: Sizes.default16, color: ColorsUtils.color363);
  }

  TextStyle get defaultStyle {
    return StylesUtils.customTextStyle(fontSize: Sizes.default13, color: ColorsUtils.color797);
  }

  TextStyle get whiteStyle {
    return StylesUtils.customTextStyle(fontSize: Sizes.default13);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ToolsUtils.getDefaultBackgroundColor(),
      appBar: ToolsUtils.getDefaultBrnAppBar('自建活动'),
      body: SingleChildScrollView(
        child: Column(
          children: [
            InkWell(
              onTap: () {
                Get.toNamed(RouteGet.marketStoreTicket);
              },
              child: Container(
                margin: const EdgeInsets.all(Sizes.default20),
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                padding: const EdgeInsets.all(Sizes.default10),
                height: 110,
                child: Row(
                  children: [
                    const GFImageOverlay(
                      height: Sizes.default60,
                      width: Sizes.default60,
                      image: NetworkImage(
                          'https://cdn7.axureshop.com/demo/1525603/images/自建活动/u4157.png'),
                      color: Colors.transparent,
                    ),
                    Expanded(
                        child: Container(
                          padding: const EdgeInsets.only(left: Sizes.default20),
                          alignment: Alignment.centerLeft,
                          child: Column(
                            children: [
                              Container(
                                alignment: Alignment.centerLeft,
                                child: Text(
                                  '进店领代金券 (3)',
                                  style: style,
                                ),
                              ),
                              Expanded(
                                  child: Container(
                                    alignment: Alignment.centerLeft,
                                    child: Text(
                                      '创建代金券吸引更多客流',
                                      style: defaultStyle,
                                    ),
                                  )),
                              Container(
                                alignment: Alignment.centerLeft,
                                child: Wrap(
                                  spacing: Sizes.default10,
                                  children: [
                                    Container(
                                      alignment: Alignment.center,
                                      decoration: BoxDecoration(
                                          image: DecorationImage(
                                              image: ToolsUtils.assetImage('tag.png'),
                                              alignment: Alignment.topLeft)),
                                      constraints:
                                      const BoxConstraints.expand(width: Sizes.default60, height: 22),
                                      child: Text(
                                        '拉新',
                                        style: whiteStyle,
                                      ),
                                    ),
                                    Container(
                                      alignment: Alignment.center,
                                      decoration: BoxDecoration(
                                          image: DecorationImage(
                                              image: ToolsUtils.assetImage('tag2.png'),
                                              alignment: Alignment.topLeft)),
                                      constraints:
                                      const BoxConstraints.expand(width: Sizes.default60, height: 22),
                                      child: Text(
                                        '引流',
                                        style: whiteStyle,
                                      ),
                                    ),
                                  ],
                                ),
                              )
                            ],
                          ),
                        )),
                    ToolsUtils.iconRightArrow()
                  ],
                ),
              ),
            ),
            InkWell(
              onTap: () {
                Get.toNamed(RouteGet.marketReduceFull);
              },
              child: Container(
                margin: const EdgeInsets.only(
                    left: Sizes.default20, right: Sizes.default20, bottom: Sizes.default20),
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                padding: const EdgeInsets.all(Sizes.default10),
                height: 110,
                child: Row(
                  children: [
                    const GFImageOverlay(
                      height: Sizes.default60,
                      width: Sizes.default60,
                      image: NetworkImage(
                          'https://cdn7.axureshop.com/demo/1525603/images/自建活动/u4157.png'),
                      color: Colors.transparent,
                    ),
                    Expanded(
                        child: Container(
                      padding: const EdgeInsets.only(left: Sizes.default20),
                      alignment: Alignment.centerLeft,
                      child: Column(
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '店铺满减 (3)',
                              style: style,
                            ),
                          ),
                          Expanded(
                              child: Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '下单满足条件可享受减免',
                              style: defaultStyle,
                            ),
                          )),
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: Sizes.default10,
                              children: [
                                Container(
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      image: DecorationImage(
                                          image: ToolsUtils.assetImage('tag3.png'),
                                          alignment: Alignment.topLeft)),
                                  constraints: const BoxConstraints.expand(
                                      width: Sizes.default60, height: 22),
                                  child: Text(
                                    '促销',
                                    style: whiteStyle,
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                    )),
                    ToolsUtils.iconRightArrow()
                  ],
                ),
              ),
            ),
            InkWell(
              onTap: () {
                Get.toNamed(RouteGet.marketVoucherFullCash);
              },
              child: Container(
                margin: const EdgeInsets.only(
                    left: Sizes.default20, right: Sizes.default20, bottom: Sizes.default20),
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                padding: const EdgeInsets.all(Sizes.default10),
                height: 110,
                child: Row(
                  children: [
                    const GFImageOverlay(
                      height: Sizes.default60,
                      width: Sizes.default60,
                      image: NetworkImage(
                          'https://cdn7.axureshop.com/demo/1525603/images/自建活动/u4157.png'),
                      color: Colors.transparent,
                    ),
                    Expanded(
                        child: Container(
                      padding: const EdgeInsets.only(left: Sizes.default20),
                      alignment: Alignment.centerLeft,
                      child: Column(
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '下单满返代金券 (3)',
                              style: style,
                            ),
                          ),
                          Expanded(
                              child: Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '下单满足条件返代金券',
                              style: defaultStyle,
                            ),
                          )),
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: Sizes.default10,
                              children: [
                                Container(
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      image: DecorationImage(
                                          image: ToolsUtils.assetImage('tag4.png'),
                                          alignment: Alignment.topLeft)),
                                  constraints: const BoxConstraints.expand(
                                      width: Sizes.default60, height: 22),
                                  child: Text(
                                    '复购',
                                    style: whiteStyle,
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                    )),
                    ToolsUtils.iconRightArrow()
                  ],
                ),
              ),
            ),
            InkWell(
              onTap: () {
                Get.toNamed(RouteGet.marketFullGift);
              },
              child: Container(
                margin: const EdgeInsets.only(
                    left: Sizes.default20, right: Sizes.default20, bottom: Sizes.default20),
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                padding: const EdgeInsets.all(Sizes.default10),
                height: 110,
                child: Row(
                  children: [
                    const GFImageOverlay(
                      height: Sizes.default60,
                      width: Sizes.default60,
                      image: NetworkImage(
                          'https://cdn7.axureshop.com/demo/1525603/images/自建活动/u4157.png'),
                      color: Colors.transparent,
                    ),
                    Expanded(
                        child: Container(
                      padding: const EdgeInsets.only(left: Sizes.default20),
                      alignment: Alignment.centerLeft,
                      child: Column(
                        children: [
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '店铺满赠 (3)',
                              style: style,
                            ),
                          ),
                          Expanded(
                              child: Container(
                            alignment: Alignment.centerLeft,
                            child: Text(
                              '下单满足条件送赠品',
                              style: defaultStyle,
                            ),
                          )),
                          Container(
                            alignment: Alignment.centerLeft,
                            child: Wrap(
                              spacing: Sizes.default10,
                              children: [
                                Container(
                                  alignment: Alignment.center,
                                  decoration: BoxDecoration(
                                      image: DecorationImage(
                                          image: ToolsUtils.assetImage('tag5.png'),
                                          alignment: Alignment.topLeft)),
                                  constraints: const BoxConstraints.expand(
                                      width: Sizes.default100, height: 22),
                                  child: Text(
                                    '提高营业额',
                                    style: whiteStyle,
                                  ),
                                ),
                              ],
                            ),
                          )
                        ],
                      ),
                    )),
                    ToolsUtils.iconRightArrow()
                  ],
                ),
              ),
            ),
            InkWell(
              onTap: () {
                Get.toNamed(RouteGet.marketRecommendActivity);
              },
              child: Container(
                margin: const EdgeInsets.only(
                    left: Sizes.default20, right: Sizes.default20, bottom: Sizes.default20),
                height: 110,
                decoration: BoxDecoration(
                    color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
                child: Stack(
                  children: [
                    Container(
                      padding: const EdgeInsets.all(Sizes.default10),
                      child: Row(
                        children: [
                          const GFImageOverlay(
                            height: Sizes.default60,
                            width: Sizes.default60,
                            image: NetworkImage(
                                'https://cdn7.axureshop.com/demo/1525603/images/自建活动/u4157.png'),
                            color: Colors.transparent,
                          ),
                          Expanded(
                              child: Container(
                            padding: const EdgeInsets.only(left: Sizes.default20),
                            alignment: Alignment.centerLeft,
                            child: Column(
                              children: [
                                Container(
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '商品推荐活动 (3)',
                                    style: style,
                                  ),
                                ),
                                Expanded(
                                    child: Container(
                                  alignment: Alignment.centerLeft,
                                  child: Text(
                                    '店铺海报引导，商品推荐我作主',
                                    style: defaultStyle,
                                  ),
                                )),
                                Container(
                                  alignment: Alignment.centerLeft,
                                  child: Wrap(
                                    spacing: Sizes.default10,
                                    children: [
                                      Container(
                                        alignment: Alignment.center,
                                        decoration: BoxDecoration(
                                            image: DecorationImage(
                                                image: ToolsUtils.assetImage('tag6.png'),
                                                alignment: Alignment.topLeft)),
                                        constraints: const BoxConstraints.expand(
                                            width: Sizes.default100, height: 22),
                                        child: Text(
                                          '汇聚推荐商品',
                                          style: whiteStyle,
                                        ),
                                      ),
                                    ],
                                  ),
                                )
                              ],
                            ),
                          )),
                          ToolsUtils.iconRightArrow()
                        ],
                      ),
                    ),
                    Positioned(
                      top: 0,
                      left: 0,
                      width: 40,
                      height: 38,
                      child: CustomPaint(
                        painter: _PainterBg(),
                        child: Transform.rotate(
                            //旋转45度
                            angle: -pi / 4,
                            child: Container(
                              padding: const EdgeInsets.only(bottom: 12),
                              alignment: Alignment.center,
                              child: Text(
                                'NEW',
                                style: StylesUtils.customTextStyle(fontSize: Sizes.default10),
                              ),
                            )),
                      ),
                    )
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class _PainterBg extends CustomPainter {
  @override
  void paint(Canvas canvas, Size size) {
    Paint paint = Paint()
      ..style = PaintingStyle.fill
      ..filterQuality = FilterQuality.high
      ..color = ColorsUtils.parseColorFromHexString(ColorsUtils.colorFf6);

    Path path = Path();
    path.moveTo(0, size.height / 2);
    path.lineTo(0, size.height);
    path.lineTo(size.width, 0);
    path.lineTo(size.width / 2, 0);
    path.close();
    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(covariant CustomPainter oldDelegate) {
    return true;
  }
}
